<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="divport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="./img/logo25.svg">
    <title>康桥运单查询</title>
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="head_wrapper">
        <div class="container">
            <div id="lg" class="s-p-top">
                <img id="s_lg_img" class="s_lg_img_gold_show" src="./img/logo25.svg" width="270" height="129">
            </div>
            <div class="">
                <div name="f" id="form" class="fm">
                    <span id="s_kw_wrap" class="bg s_ipt_wr quickdelete-wrap">
                        <input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off"></span>
                    <span class="btn_wr s_btn_wr bg" id="s_btn_wr">
                        <button type="submit" value="查询" id="su" class="btn self-btn bg s_btn"
                            onclick="search()">查询</button>
                    </span>
                </div>
            </div>
        </div>

        <!-- 时间线 -->
        <div class="dateX">
            <div wx:if="{{!!timeLineList}}" id="timeLine" class="van-steps van-steps--vertical">
                <div class="van-steps__items">
                    <div class="van-hairline van-step van-step--vertical" id="forList" style="display: none;">
                        <div class="van-step__title van-step-left">
                            <!-- <div class="date">{{item.date}}</div>
                        <div class="dateTime">{{item.dateTime}}</div> -->
                            <div class="date">2019-12-12</div>
                            <div class="dateTime">14:22:42</div>
                        </div>
                        <div class="van-step-right">
                            <div class="van-step__title">
                                <!-- <span class="badge">{{item.UniSatusCode}}</span> -->
                                <span class="badge">成功入海关预录入库</span>
                                <div class="details" data-index="{{index}}" bindtap="showDetails">
                                    <!-- <text class="text {{!detailsMore[index] || 'more'}}">{{item.StatusNote}}</text> -->
                                    <text class="text {{!detailsMore[index] || 'more'}}">dfe</text>
                                </div>
                            </div>
                            <div class="van-step__circle-container"><i class="van-step__circle"></i>
                            </div>
                            <div class="van-step__line"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div>

    <script src="./js/jquery.3.5.1.js"></script>
    <script src="./js/md5.min.js"></script>
    <script>


        // 配置
        let config = {
            baseConfig: {
                AppKey: "miniLxinKey",
                AppSecret: "miniLxinSec",
                mode: "dev",
            }
        }

        // 请求参数
        let ajaxData = {
            VirtualPath: 'CAEMail',
            BizNo: '',
            BizParameter: 'N',
            count: 100,
        }

        // $.ajax({
        //     data: { VirtualPath: "CAEMail", BizNo: "9999", BizParameter: "N", count: 100 }
        //     , dataType: "json"
        //     , headers: {
        //         "Content-Type": "application/json",
        //         DataTag: "7258765b-5646-49cb-b36a-7064551c3b1e",
        //         app_key: "miniLxinKey",
        //         instance_id: "df475716-418a-47c4-8203-20f672a69bb7",
        //         sign: "BDD874B34BE3E8C7127D715D5F5FA9CF",
        //         timestamp: 1611974993993
        //     }
        //     , success: function (data) {
        //         console.log(data)
        //     }
        //     , timeout: 10000
        //     , type: "GET"
        //     , url: "https://dev.tongyicang.com:8173/api/UniLogs"
        // })

        var xhr = new XMLHttpRequest();

        // 原生ajax
        // var xhr = new XMLHttpRequest();
        // // 超时设置为3s
        // xhr.timeout = 3000
        // // 超时后触发的回调函数
        // xhr.ontimeout = function () {
        //     console.log("响应时间：超时为3s")
        // }
        // xhr.open("GET", "https://dev.tongyicang.com:8173/api/UniLogs" + "?" + "VirtualPath=CAEMail&BizNo=9999&BizParameter=N&count=100")
        // xhr.setRequestHeader("DataTag", "7258765b-5646-49cb-b36a-7064551c3b1e")
        // xhr.setRequestHeader("app_key", "miniLxinKey")
        // xhr.setRequestHeader("instance_id", "df475716-418a-47c4-8203-20f672a69bb7")
        // xhr.setRequestHeader("sign", "BDD874B34BE3E8C7127D715D5F5FA9CF")
        // xhr.setRequestHeader("timestamp", "1611974993993")
        // xhr.send();
        // xhr.onreadystatechange = function () {
        //     if (xhr.readyState === 4) {
        //         if (xhr.status >= 200 && xhr.status <= 300) {
        //             console.log(JSON.parse(xhr.response))
        //         }
        //     }
        // }

        let data = [
            {
                BillTypeGuid: "Pallet"
                , BizNo: "9999"
                , BizParameter: "22"
                , CreateDateTime: "2021-01-29 16:27:39"
                , CreateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947"
                , Guid: "015405ae-524a-4951-80f4-c9a4b06c501d"
                , LogSource: "11"
                , Note: "string"
                , PreConfig: null
                , StatusNote: "成功入海关预录入库2;"
                , StatusTime: "1611907620000"
                , SyncDataId: "string"
                , SyncDataType: "string"
                , UniStatusCode: "5141"
                , UpdateDateTime: "2021-01-29 16:27:39"
                , UpdateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947"
                , UseExInfo: "string"
                , VirtualPath: "CAEMail"
            },
            {
                BillTypeGuid: "Pallet",
                BizNo: "9999",
                BizParameter: "22",
                CreateDateTime: "2021-01-29 16:26:55",
                CreateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947",
                Guid: "31b6b645-0e7e-42ec-bfda-ee6c1b754a88",
                LogSource: "11",
                Note: "string",
                PreConfig: null,
                StatusNote: "成功入海关预录入库1;",
                StatusTime: "1611907690000",
                SyncDataId: "string",
                SyncDataType: "string"
                , UniStatusCode: "5321",
                UpdateDateTime: "2021-01-29 16:26:55",
                UpdateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947",
                UseExInfo: "string"
                , VirtualPath: "CAEMail"
            },
            {
                BillTypeGuid: "Pallet",
                BizNo: "9999"
                , BizParameter: "22",
                CreateDateTime: "2021-01-29 16:21:10",
                CreateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947",
                Guid: "5ec781c2-b06d-4b1b-ae8f-086e91e5ea39",
                LogSource: "11",
                Note: "string",
                PreConfig: null,
                StatusNote: "成功入海关预录入库;",
                StatusTime: "1611907689000",
                SyncDataId: "string",
                SyncDataType: "string",
                UniStatusCode: "5321",
                UpdateDateTime: "2021-01-29 16:21:10",
                UpdateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947",
                UseExInfo: "string",
                VirtualPath: "CAEMail",
            },
            {
                BillTypeGuid: "Pallet",
                BizNo: "9999"
                , BizParameter: "22",
                CreateDateTime: "2021-01-29 16:21:10",
                CreateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947",
                Guid: "5ec781c2-b06d-4b1b-ae8f-086e91e5ea39",
                LogSource: "11",
                Note: "string",
                PreConfig: null,
                StatusNote: "成功入海关预录入库;",
                StatusTime: "1611907689000",
                SyncDataId: "string",
                SyncDataType: "string",
                UniStatusCode: "5321",
                UpdateDateTime: "2021-01-29 16:21:10",
                UpdateUser: "76923c0c-569f-43db-a1ac-c7bc0b9f6947",
                UseExInfo: "string",
                VirtualPath: "CAEMail",
            }]

        function forList(data_) {
            data_ && (data = data_)
            let $timeLine = $(".van-steps__items");
            let $forListT = $("#forList")
            data.forEach(function (item, index) {
                let $forList = $forListT.clone(true);
                $forList.css("display", 'block');
                $forList.find('.date').text(item.CreateDateTime.split(' ')[0])
                $forList.find('.dateTime').text(item.CreateDateTime.split(' ')[1])
                index == 0 ? $forList.find('.badge').addClass('van-step--active') : '';
                $forList.find('.badge').text(item.UniStatusCode)
                $forList.find('.text').text(item.StatusNote)

                $timeLine.append($forList)
            })
            $forListT.remove()
        }
        forList(data)

        function search() {
            let kw = $("#kw").val()
            console.log('ke', kw)
            ajaxData.BizNo = kw;
            $ajax(ajaxData, {
                url: "https://dev.tongyicang.com:8173/api/UniLogs",
                type: 'GET',
                dataType: "json",
                // jsonp: "callback",
                success: function (data) {
                    console.log(data)
                    forList(data)
                }
            })

        }

        function $ajax(ajaxData, ajaxObj, other) {
            !!other || (other = {})
            let guid = genGuid(),
                AppKey = other.AppKey || config['baseConfig'].AppKey
            if (!AppKey && !other.isAnony) {
                //如果 AppKey 不存在则跳出请求
                console.error(new Error('Ajax 发送服务器请求: AppKey 不存在, 发送服务器网络失败'))
                return;
            }

            if (other.reqJson) {
                !!ajaxObj.header || (ajaxObj.header = {})
                ajaxObj.header["content-type"] = "application/json; charset=utf-8"
                ajaxData = JSON.stringify(ajaxData)
            }

            let initData = {
                timestamp: new Date().getTime()
            };
            !AppKey || (initData.app_key = AppKey)
            let headerData = Object.assign({}, initData) //用于添加到 header
            if (other.ajaxHeader !== null && typeof other.ajaxHeader === "object") {
                Object.assign(headerData, other.ajaxHeader)
            }

            if (!other.noSign && !!ajaxData && !other.reqJson && ((!!ajaxObj["contentType"] && !ajaxObj["contentType"].includes("application/json")) || (ajaxObj['method'] !== 'post'))) {
                Object.assign(initData, ajaxData) //用于生成 sign
            }

            let options = {
                type: 'post',
                dataType: 'json',
                timeout: 10000,
                headers: Object.assign({
                    instance_id: genGuid(),
                    DataTag: guid,
                    "Content-Type": "application/json"
                }, headerData),
                data: ajaxData,
            };
            other.noSign || (options.headers.sign = getSign(initData, other.AppSecret))
            Object.assign(options, ajaxObj)

            $.ajax(options);
        }

        function objKeySorttoStr(obj) { //排序函数
            let newkey = Object.keys(obj).sort(function (a, b) {
                let aLower = a.toLowerCase(),
                    bLower = b.toLowerCase()
                if (aLower < bLower) return -1;
                if (aLower > bLower) return 1;
                if (aLower == bLower) {
                    return a > b ? -1 : 1
                }
                return 0;
            });
            //先用Object内置类的keys方法获取要排序对象的属性名，再利用Array原型上的sort方法对获取的属性名进行排序，newkey是一个数组
            let newStr = ''; //创建一个字符串变量，用于存放排好序的键值对
            for (let i = 0; i < newkey.length; i++) { //遍历newkey数组
                newStr += newkey[i] + obj[newkey[i]]
            }
            return newStr; //返回排好序拼接成的字符串
        }

        // 获取唯一id
        function genGuid() {
            //生成 网络请求 Id
            return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
                let r = Math.random() * 16 | 0,
                    v = c == 'x' ? r : (r & 0x3 | 0x8);
                return v.toString(16); //16进制
            });
        }

        function getSign(obj, appSecret) {
            //生成ajax Sign
            !!appSecret || (appSecret = config['baseConfig'].AppSecret)
            let signstr = appSecret + objKeySorttoStr(obj) + appSecret
            return md5(signstr).toUpperCase();
        }
    </script>
</body>

</html>